<template>
	<view class="page">
		<view class="user d-waikuang-20-0 d-beijing-bai ">
			<!--头部-->
			<Dfanhui
			title="VIP会员"
			>
			</Dfanhui>
			<view class="d-neikuang-40">
				<view class="d-kuan d-juzhong d-wenzi-30 d-jiacu" style="color: #6a488a;">
					{{ u_data.wo && u_data.wo.score }}{{ wwwData && wwwData.setting && wwwData.setting.jifen }}
				</view>
			</view>
		</view>
		<view class="user">
			<image src="/static/member/avatar.png"/>
			<view>
				<text>易师傅</text>
				<text>您的会员已到期</text>
			</view>
		</view>
		
		<view class="option">
			<view class="option-title">会员套餐</view>
			<view class="option-list">
				<view :class="'option-item ' + (k === current ? 'option-selected' : '')" v-for="(v, k) in options" :key="k" @click="change(k)">
					<text>{{v.time}}</text>
					<text>￥{{v.price}}</text>
					<!--text>原价：￥{{v.oldPrice}}</text-->
					<!--view class="option-item-line"></view-->
				</view>
			</view>
			<view class="option-botton" @click="pay()">立即开通</view>
		</view>
		
		<view class="table">
			<view class="td th">
				<view>功能权限</view>
				<view>普通用户</view>
				<view>VIP用户</view>
			</view>
			<view class="td" v-for="(v, k) in advantages" :key="k">
				<view>{{v.name}}</view>
				<view>
					<image src="/static/member/no.png" v-if="v.normal === 0"></image>
					<image src="/static/member/ok.png" v-else-if="v.normal === 1"></image>
					<text v-else>{{v.normal}}</text>
				</view>
				<view>
					<image src="/static/member/ok.png" v-if="v.vip === 1"></image>
					<text v-else>{{v.vip}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import Dfanhui from '@/components/d-fanhui/d-fanhui.vue'
	export default {
		data() {
			return {
				options: [
					{time: '半年', oldPrice: 48, price: 40},
					{time: '一年', oldPrice: 80, price: 60},
					{time: '永久', oldPrice: 198, price: 188},
					
				],
				advantages: [
					{name: '免广告', normal: 0, vip: 1},
					{name: '自定义导出', normal: 0, vip: 1},
					{name: '权限设置', normal: 0, vip: 1},
					{name: '数据恢复', normal: 0, vip: 1},
					{name: '批量上传', normal: '5个', vip: '不限'},
					{name: '项目数量', normal: '3个', vip: '不限'},
					{name: '存储空间', normal: '3G', vip: '200G'}
				],
				current: 0, // 当前选中套餐
			}
		},
		onShow() {
			this.getu_api();

		},
		onLoad() {

		},
		components: {
			Dfanhui,
		},
		methods: {
			change(k){
				this.current = k;
			},
			pay(){
				console.log(this.options[this.current])
			},
			//个人信息
			getu_api(){
				// console.log('Calling getu_api with uid:', this.uid);
				var uid = this.$store.state.memberuid;
				var keycode = this.$store.state.keycode;
				const data = {
						uid: uid,
						api_auth_uid: uid,
						api_auth_code: keycode,
					}
				var get_data = getRequest(UApi.getU(),data);
				var res;
				get_data.then(duixin_data => {
					res = duixin_data;
					if(res.data.code) {
						if(uid){
							//this.u_data = res.data.data.wo;
						} else {
							//this.u_data = res.data.data.u;
						}
						this.u_data = res.data.data;
						//this.u_data = res.data.data;
						

					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import "./vip.scss";
</style>